<template>
    <view class="container">
        <bt-cropper ref="cropper" :imageSrc="imageSrc" :ratio="1/1"></bt-cropper>
        <button @click="crop">裁切</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                imageSrc: '',
            };
        },
        onLoad(option) {
            this.imageSrc = option.imageSrc
        },
        methods: {
            crop(){
                // 通过组件定义的ref调用cropper方法，返回一个promise对象
                this.$refs.cropper.crop().then((res)=>{
                    console.log('crop',res)
                    uni.$emit('ApplyAvatar', res)
                    this.$backT()
                })
            },
        }
    };
</script>

<style lang="scss">
    page{
        background-color: #f5f5f5;
    }
    .container{
        /** 外层一定要指定大小 */
        height:90vh;
    }

</style>
